<!doctype html>
<html>
<head>
<title>Test for Bug 26183 - [@font-face] font-family descriptor with multiple names should be discarded</title>
<style>
.testtext {
    font-size: 64px;
    font-family: Arial;
    border: solid 1px;
}
@font-face {
    font-family: myfont1, myfont2;
    src: local(Courier);
}
</style>
<script src="../../resources/js-test.js"></script>
</head>
<body onload="test()">
<div id="description"></div>
Test:<br/>
<span id="testText" class="testtext" style="font-family: myfont1, Arial">Text iii</span><br/>
Must match:<br/>
<span id="mustMatch" class="testtext" style="font-family: Arial">Text iii</span><br/>
Must not match:<br/>
<span id="mustNotMatch" class="testtext" style="font-family: Courier">Text iii</span><br/>
<div id="console"></div>
<script>
if (window.testRunner)
    testRunner.dumpAsText();

description("font-family descriptor in @font-face rule can take only one family. Hence the @font-face rule in this test must be ignored.");

function test()
{
    shouldBeTrue("document.getElementById('testText').offsetWidth == document.getElementById('mustMatch').offsetWidth");
    shouldBeTrue("document.getElementById('testText').offsetWidth != document.getElementById('mustNotMatch').offsetWidth");
}
</script>
</body>
</html>

